<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>博客详情页</title>
        <link type="text/css" rel="stylesheet" href="css/index.css">
    </head>
    <body>
        <!--header-->
        <div class="header tblock">
            <a href="#"><img alt="logo" src="img/logo.png" title="MeynL的博客" ></a>
            <div class="select min-hidden">
                <i></i>
                <input type="text">
                <button>搜索</button>
            </div>
        </div>
        <!--nav-->
        <div class="nav">
            <div class="nav-cont tblock">
            <a class="act">首页</a>
            <a>关于</a>
            </div>
        </div>
        <!--content-->
        <div class="cont tblock">
        <!--left-->
        <div class="left">
            <div class="title">
                <i></i><span>文章详情</span>
            </div>
            <header>
                <h2>标题标题</h2>
                <section>
                    <i class="iconfont"> &#xe619;</i>
                    2017-09-10
                    &nbsp;&nbsp;
                    <i class="iconfont"> &#xe73a;</i>
                    MeynL
                    &nbsp;&nbsp;
                    <i class="iconfont"> &#xe626;</i>
                    标签
                </section>
            </header>
            <content>
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
                内容内容内容内容内容内容内容内容内容内容
            </content>
            <footer>
                <i></i>
                欢迎转载，转载请注明出处【MeynLCSS】
            </footer>
        </div>
        <!--right-->
        <div class="right min-hidden">
                <div class="about">
                    <h1><span>关于博主</span><i>|</i>About Blogger</h1>
                    <a href="#" title="mail">
                        <i class="iconfont">&#xe668;</i>
                    </a>
                    <a href="#" title="weibo">
                        <i class="iconfont">&#xe8b1;</i>
                    </a>
                    <a href="#" title="QQ">
                        <i class="iconfont">&#xe61e;</i>
                    </a>
                </div> 
                <div class="tags">
                    <h1><span>标签云</span><i>|</i>Tag Cloud</h1>
                    <a href="#">标签</a>
                    <a href="#">标签</a>
                    <a href="#">标签</a>
                    <a href="#">标签</a>
                    <a href="#">标签</a>
                    <a href="#">标签</a>
                </div>
                <div class="hot">
                    <h1><span>推荐文章</span><i>|</i>Recommend</h1>
                    <h2>
                        <img src="img/test.png">
                        <strong>标题标题标题标题标题aaaaaaaaaaaaaaaaaaaa</strong><br>
                        <em>发布时间：XXXX-XX-XX 作者：XXX</em>
                    </h2>
                    <h2>
                        <img src="img/test.png">
                        <strong>标题标题标题标题标题aaaaaaaaaaaaaaaaaaaa</strong><br>
                        <em>发布时间：XXXX-XX-XX 作者：XXX</em>
                    </h2>
                    <h2>
                        <img src="img/test.png">
                        <strong>标题标题标题标题标题aaaaaaaaaaaaaaaaaaaa</strong><br>
                        <em>发布时间：XXXX-XX-XX 作者：XXX</em>
                    </h2>
                    <h2>
                        <img src="img/test.png">
                        <strong>标题标题标题标题标题aaaaaaaaaaaaaaaaaaaa</strong><br>
                        <em>发布时间：XXXX-XX-XX 作者：XXX</em>
                    </h2>
                </div>
        </div>
        </div>
        <footer>
        </footer>
        <script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
    </body>
</html>